<template>
      <div>
        <button @click="sub">-</button>
        <span>{{ value }}</span>
        <button @click="add">+</button>
      </div>
</template>

<script>
export default {
  data(){
    return {

    }
  },
  props: {
    value:Number
  },
  methods:{
    sub(){
        // eslint-disable-next-line
        // 让父元素去修改这个props传过来的value
        
        // 10 - 1
        this.$emit('input', this.value - 1)
        // this.value--
    },
    add(){
        this.$emit('input', this.value + 1)
    }
  },
  components: {},

}
</script>
<style scoped>
span{
    margin:10px;
}
</style>